<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/html">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>管理员管理</title>
    <link rel="stylesheet" href="layui/css/layui.css">
    <script src="/layui/layui.js"></script>
    <script type="text/javascript" src="js/jquery/jquery.min.js"></script>
</head>

<body>
<!--导航栏-->
<ul class="layui-nav">
    <li class="layui-nav-item layui-this"><a href="/admin/layuiAdminPage">管理员管理</a></li>

    <li class="layui-nav-item">
        <a href="/admin/layuiProductPage">商品查看</a>
    </li>
    <li class="layui-nav-item">
        <a href="/admin/layuiAddProductPage">添加商品</a>
    </li>
    <li class="layui-nav-item">
    <a href="/admin/layuiOrderPage">订单管理</a>
    </li>
</ul>
<!--添加管理员-->
<form action="/admin/addAdmin" method="post" class="layui-form" id="admin_add">
    <div class="layui-form-item">
        <label class="layui-form-label">管理员名</label>
        <div class="layui-input-block">
            <input id="admin_name" type="text" lay-verify="title" autocomplete="off" placeholder="请输入管理员名" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">管理员密码</label>
        <div class="layui-input-block">
            <input id="admin_password" type="text" lay-verify="title" autocomplete="off" placeholder="请输入管理员密码" class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-input-block">
            <button type="submit" class="layui-btn" lay-submit="" lay-filter="demo1">立即提交</button>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>
</form>
<!--管理员数据表-->
<table id="admin_table" lay-filter="admin_table"></table>

<script type="text/html" id="adminToolbar">
    <div class="layui-btn-container">
<!--        <button class="layui-btn layui-btn-sm" lay-event="getCheckData">获取选中行数据</button>-->
<!--        <button class="layui-btn layui-btn-sm" lay-event="getCheckLength">获取选中数目</button>-->
<!--        <button class="layui-btn layui-btn-sm" lay-event="isAll">验证是否全选</button>-->
    </div>
</script>

<script type="text/html" id="adminBar">
    <a class="layui-btn layui-btn-xs" lay-event="unlock">解冻</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="lock">冻结</a>
</script>

<!--管理员数据表js-->
<script>
    layui.use('table', function(){
        var table = layui.table;

        //渲染数据
        table.render({
            elem: '#admin_table'
            ,height: 600
            ,toolbar:true
            ,toolbar: '#adminToolbar' //开启头部工具栏，并为其绑定左侧模板
            ,defaultToolbar: ['filter', 'exports', 'print', { //自定义头部工具栏右侧图标。如无需自定义，去除该参数即可
                title: '提示'
                ,layEvent: 'LAYTABLE_TIPS'
                ,icon: 'layui-icon-tips'
            }]
            ,title: '管理员数据表'
            ,method:'post'
            ,url: '/admin/showAdmin' //数据接口
            ,page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
                layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
                //,curr: 5 //设定初始在第 5 页
                ,groups: 1 //只显示 1 个连续页码
                ,first: false //不显示首页
                ,last: false //不显示尾页

            } //开启分页
            // ,response: {
            //     statusCode: 200 //重新规定成功的状态码为 200，table 组件默认为 0
            // }
            ,parseData: function(res){ //将原始数据解析成 table 组件所规定的数据
                return {
                    "code": 0, //解析接口状态
                    "msg": res.msg, //解析提示文本
                    //"count": 0, //解析数据长度
                    "data": res.data.adminList //解析数据列表

                };
            }
            ,cols: [[//表头
                {type: 'checkbox', fixed: 'left'}
                ,{field: 'adminId', title: 'ID', width:80, edit: 'text', sort: true, fixed: 'left'}
                ,{field: 'adminName', title: '管理员名', edit: 'text', width:80}
                ,{field: 'isLocked', title: '状态', width:80}
                ,{fixed: 'right', title:'操作', toolbar: '#adminBar', width:150}
            ]]
            ,id: 'adminReload'
        });

        //头工具栏事件
        table.on('toolbar(admin_table)', function(obj){
            var checkStatus = table.checkStatus(obj.config.id);
            switch(obj.event){
                case 'getCheckData':
                    var data = checkStatus.data;
                    layer.alert(JSON.stringify(data));
                    break;
                case 'getCheckLength':
                    var data = checkStatus.data;
                    layer.msg('选中了：'+ data.length + ' 个');
                    break;
                case 'isAll':
                    layer.msg(checkStatus.isAll ? '全选': '未全选');
                    break;

                //自定义头工具栏右侧图标 - 提示
                case 'LAYTABLE_TIPS':
                    layer.alert('这是工具栏右侧自定义的一个图标按钮');
                    break;
            };
        });

        //监听行工具事件
        table.on('tool(admin_table)', function(obj){
            var data = obj.data;
            //console.log(obj)
            if(obj.event === 'del'){
                layer.confirm('真的删除行么', function(index){
                    obj.del();
                    layer.close(index);
                });
            } else if(obj.event === 'edit'){
                layer.prompt({
                    formType: 2
                    ,value: data.email
                }, function(value, index){
                    obj.update({
                        email: value
                    });
                    layer.close(index);
                });
            }else if(obj.event === 'lock'){
                $.ajax({
                    url:'/admin/lockAdmin',
                    type:'post',
                    data:{'adminName': data.adminName},
                    dataType:'json',
                    success:function (data){
                        alert(data.msg);
                        window.location.href="/admin/layuiAdminPage";
                    }
                });
            }else if(obj.event === 'unlock'){
                $.ajax({
                    url:'/admin/unlockAdmin',
                    type:'post',
                    data:{'adminName': data.adminName},
                    dataType:'json',
                    success:function (data){
                        alert(data.msg);
                        window.location.href="/admin/layuiAdminPage";
                    }
                });
            }
        });

    });
</script>
<script>
    $("#admin_add").submit(function(){
        var adminName =  $("#admin_name").val();
        var password = $("#admin_password").val();
        console.log(adminName)
        $.ajax({
            url: "addAdmin",
            data: {"adminName": adminName, "password": password},
            type: "post",
            success: function(data){
                alert(data.msg);
                window.location.href="/admin/layuiAdminPage";
            }
        })
        return false;
    })
</script>

</body>

</html>